import React, { useEffect } from 'react';
import { useFusionTable, useSetState } from 'ahooks';
import { useRequest, useHistory } from 'ice';
import { Button, Card, Loading} from '@alifd/next';
import { getUserGroup } from '@/api/user';
import Search from '@/components/Search';
import TableList from '@/components/TableList';
const UserTable: React.FC = () => {
  const [state, setState] = useSetState({
    dataSource: [],
    total: 0,
    visible: false,
  });
  const { request } = useRequest(getUserGroup);
  // 数据列表
  const getList = async () => {
    try {
      setState({visible:true});
      const { code, result }: any = await request({
        pageNum: 1,
        pageSize: 100,
      });
      if (!code) {
        setState({dataSource: result.data, total: result.total});
      }
    } catch (error) {
      console.log(error);
    } finally {
      setState({visible: false});
    }
  }
  useEffect(() => {
    getList();
  }, []);
  // 编辑
  const editClick = (id: string) => {
    console.log(id);
  }
  const setCell = (...args: any[]) => {
    return (
      <Button
        text
        type="primary"
        onClick={()=>editClick(args[2].id)}
      >
        编辑
      </Button>
    )
  };

  const userGroupTable = [
      {
        key: '1',
        title: '组名',
        dataIndex: 'groupName',
      },
      {
        key: '2',
        title: '用户组编号',
        dataIndex: 'id',
      },
      {
        key: '3',
        title: '用户数',
        dataIndex: 'groupNum',
      },
      {
        key: '4',
        title: '创建时间',
        dataIndex: 'createTime',
      },
      {
        key: '5',
        title: '创建人',
        dataIndex: 'operator',
      },
      {
        key: '6',
        title: '操作',
        render: setCell,
      },
    ]
  const searchList = [
    {
      name: 'userName',
      title: '用户名',
      value: '',
      type: 'input'
    },
    {
      name: 'pass',
      title: '密码',
      value: '',
      type: 'input'
    },
    {
      name: 'typeName',
      title: '选择数据',
      value: '',
      type: 'select',
      options: [
        {
          value: 0,
          label: '否',
        },
        {
          value: 1,
          label: '是',
        },
      ]
    },
    {
      name: 'name',
      title: '选择列表',
      value: '',
      type: 'select',
      options: [
        {
          value: 0,
          label: '全部',
        },
        {
          value: 1,
          label: '列表',
        },
      ]
    }
  ]
  return (
    <Loading tip="加载中..." visible={state.visible} >
        <Card>
          <Card.Content >
          <Search searchList={searchList}/>
            <TableList
              columns={userGroupTable}
              dataSource={state.dataSource}
            />
          </Card.Content>
        </Card>
    </Loading>
  )
}

export default UserTable;
